<template>
	<div>
		<div id="app" class="wrapper wrapper-content">
			<div class="row">
				<div>
					<div class="panel panel-primary">
						<div class="panel-body" style="padding: 0px 120px; box-sizing: border-box;">
							<el-form size="small" :model="inputForm" ref="inputForm" v-loading="loading" :rules="rule">
								<div style="text-align:center">
									<h3 style="font-weight: bold;color: black;font-size:24px">差旅报销申请单</h3>
								</div>
								<table
									style="margin:0 auto;width:80%;margin-top:20px;border-collapse: collapse;margin-bottom:20px">
									<tr style="line-height: 3.5;">
										<td colspan="4"
											style="font-weight: bold;text-align: left;padding-left: 32px;position: relative;font-size: 14px">
											<img src="../../../../../assets/imgs/processManagement/work.png" alt=""
												style="position: absolute;width: 20px;height: 20px;left: 0px;top: 14px;margin-left: 8px">
											基本信息
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15">申请人</td>
										<td class="width-30">
											<el-form-item prop="applyuser.id">
												<user-select :limit='1' :value="inputForm.applyuser.id"
													@getValue='(value) => {inputForm.applyuser.id=value}' disabled>
												</user-select>
											</el-form-item>
										</td>
										<td class="width-15">所属公司</td>
										<td class="width-30"> 
											<el-form-item prop="company.id">
												<SelectTree ref="company" :props="{
                                                value: 'id',             // ID字段名
                                                label: 'name',         // 显示名称
                                                children: 'children'    // 子级字段名
                                              }" disabled url="/sys/office/treeData?type=2"
													:value="inputForm.company.id" :clearable="true" :accordion="true"
													@getValue="(value) => {inputForm.company.id=value}" />
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15">申请时间</td>
										<td class="width-30">
											<el-form-item prop="applydate">
												<el-date-picker v-model="inputForm.applydate" type="datetime" disabled
													style="width: 100%;" value-format="yyyy-MM-dd HH:mm:ss"
													:clearable="false" placeholder="请选择">
												</el-date-picker>
											</el-form-item>
										</td>
										<td class="width-15">所属部门</td>
										<td class="width-30">
											<el-form-item prop="depart.id">
												<SelectTree ref="depart" :props="{
                                                value: 'id',             // ID字段名
                                                label: 'name',         // 显示名称
                                                children: 'children'    // 子级字段名
                                              }" disabled url="/sys/office/treeData?type=2"
													:value="inputForm.depart.id" :clearable="true" :accordion="true"
													@getValue="(value) => {inputForm.depart.id=value}" />
											</el-form-item>
										</td>
									</tr>
									<tr style="line-height: 3.5;">
										<td colspan="4"
											style="font-weight: bold;text-align: left;padding-left: 32px;position: relative;font-size: 14px">
											<img src="../../../../../assets/imgs/processManagement/basic.png" alt=""
												style="position: absolute;width: 20px;height: 20px;left: 0px;top: 14px;margin-left: 8px">
											差旅报销信息
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15"><span style="color: red">*&nbsp;</span>开始日期</td>
										<td class="width-30">
											<el-form-item prop="startdate"
												:rules="[{required: true, message:'开始日期不能为空', trigger:'blur'}]">
												<el-date-picker :disabled="formReadOnly" v-model="inputForm.startdate"
													type="date" style="width: 100%;" value-format="yyyy-MM-dd"
													format="yyyy-MM-dd" @change="travelGoOutHour" placeholder="请选择">
												</el-date-picker>
											</el-form-item>
										</td>
										<td class="width-15"><span style="color: red">*&nbsp;</span>结束日期</td>
										<td class="width-30">
											<el-form-item prop="enddate"
												:rules="[{required: true, message:'结束日期不能为空', trigger:'blur'}]">
												<el-date-picker :disabled="formReadOnly" v-model="inputForm.enddate"
													type="date" style="width: 100%;" value-format="yyyy-MM-dd"
													format="yyyy-MM-dd" @change="travelGoOutHour" placeholder="请选择">
												</el-date-picker>
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15"><span style="color: red">*&nbsp;</span>开始时间</td>
										<td class="width-30">
											<el-form-item prop="starttime"
												:rules="[{required: true, message:'开始时间不能为空', trigger:'blur'}]">
												<el-time-picker :disabled="formReadOnly" v-model="inputForm.starttime"
													style="width: 100%;" value-format="HH:mm:ss" format="HH:mm:ss"
													@change="travelGoOutHour" placeholder="请选择">
												</el-time-picker>
											</el-form-item>
										</td>
										<td class="width-15"><span style="color: red">*&nbsp;</span>结束时间</td>
										<td class="width-30">
											<el-form-item prop="endtime"
												:rules="[{required: true, message:'结束时间不能为空', trigger:'blur'}]">
												<el-time-picker :disabled="formReadOnly" v-model="inputForm.endtime"
													style="width: 100%;" value-format="HH:mm:ss" format="HH:mm:ss"
													@change="travelGoOutHour" placeholder="请选择">
												</el-time-picker>
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15"><span style="color: red">*&nbsp;</span>出差天数</td>
										<td class="width-30">
											<el-form-item prop="traveldays"
												:rules="[{required: true, message:'出差天数不能为空', trigger:'blur'}]">
												<el-input v-model="inputForm.traveldays" readonly></el-input>
											</el-form-item>
										</td>
										<td class="width-15"><span style="color: red">*&nbsp;</span>出差地</td>
										<td class="width-30">
											<div style="text-align: left;" @click="evectionAddressDialog=true">
												<el-form-item prop="traveldays" v-if="inputForm.beginArea==''" 
													:rules="[{required: true, message:'出差地不能为空', trigger:'blur'}]">
													<el-input v-model="inputForm.travelarea" readonly ></el-input>
												</el-form-item>
												<div v-else style="text-align: left;line-height:20px">{{inputForm.beginArea}}>{{inputForm. betweenArea}}>{{inputForm.endArea}}</div>
											</div>
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15"><span style="color: red">*&nbsp;</span>报销总额</td>
										<td class="width-30">
											<el-form-item prop="totalmoney"
												:rules="[{required: true, message:'报销总额不能为空(注意：数据来源于凭证)', trigger:'blur'}]">
												<el-input v-model="inputForm.totalmoney" disabled></el-input>
											</el-form-item>
										</td>
										<td class="width-15">大写金额</td>
										<td class="width-30">
											<el-form-item prop="totalmoneybig">
												<el-input v-model="inputForm.totalmoneybig" disabled></el-input>
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15"><span style="color: red">*&nbsp;</span>借款金额</td>
										<td class="width-30">
											<el-form-item prop="borrowmoney"
												:rules="[{required: true, message:'借款金额不能为空', trigger:'blur'}]">
												<el-input v-model="inputForm.borrowmoney" disabled></el-input>
											</el-form-item>
										</td>
										<td class="width-15">大写金额</td>
										<td class="width-30">
											<el-form-item prop="borrowmoneybig">
												<el-input v-model="inputForm.borrowmoneybig" disabled></el-input>
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15"><span style="color: red">*&nbsp;</span>核定金额</td>
										<td class="width-30">
											<el-form-item prop="approvedmoneytotal">
												<el-input v-model="inputForm.approvedmoneytotal" disabled></el-input>
											</el-form-item>
										</td>
										<td class="width-15">大写金额</td>
										<td class="width-30">
											<el-form-item prop="approvedmoneytotalbig">
												<el-input v-model="inputForm.approvedmoneytotalbig" disabled></el-input>
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHidden">
										<!-- <td class="width-15"><span style="color: red">*&nbsp;</span>实报金额</td> -->
										<td class="width-15"><span style="color: red">*&nbsp;</span>实报金额</td>
										<td class="width-30">
											<!-- <el-form-item  prop="realmoney" :rules="[{required: true, message:'实报金额不能为空(最多保留两位小数)', trigger:'blur',pattern: /^\d*\.?(\d|\d{2})$/}]"> -->
											<el-form-item prop="realmoney">
												<el-input v-model="inputForm.realmoney" disabled></el-input>
											</el-form-item>
										</td>
										<td class="width-15">大写金额</td>
										<td class="width-30">
											<el-form-item prop="realmoneybig">
												<el-input v-model="inputForm.realmoneybig" disabled></el-input>
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHiddens errorMsg">
										<td class="width-15"><span style="color: red">*&nbsp;</span>本次冲销金额</td>
										<td class="width-30">
											<el-form-item prop="writeoffmoney"
												:rules="[{required: true, message:'本次冲销金额不能为空(最多保留两位小数)', trigger:['blur','change'],pattern: /^\d*\.?(\d|\d{2})$/}]">
												<el-input v-model="inputForm.writeoffmoney"
													v-if="writeoffHidden && editSwitch" @input="writeoffmoneySwitch"
													@focus="clearwriteoffmoney"
													:disabled="formReadOnly || personWriteoff"></el-input>
												<GridSelects2 v-if=" !editSwitch || !writeoffHidden" title="选择借款金额"
													labelName='money' labelValue='id' ref="gridSelect"
													:disabled="writeoffmoneyDisabled || formReadOnly"
													value="inputForm.writeoffmoney" :limit="5"
													@getValue='getValues(arguments)' :columns="[                                        
                                    {
                                      prop: 'money',
                                      label: '借款金额'
                                    },]" :searchs="[
                                    {
                                      prop: 'money',
                                      label: '借款金额'
                                    }]" :dataListUrl="writeoffmoneyListUrl" entityBeanName="oaPersonalBorrowmoney"
													queryEntityUrl="/dlyrl/oa/personalborrow/oaPersonalBorrowmoney/queryById">
												</GridSelects2>
											</el-form-item>
										</td>
										<td class="width-15">大写金额</td>
										<td class="width-30">
											<el-form-item prop="writeoffmoneybig">
												<el-input v-model="inputForm.writeoffmoneybig" disabled></el-input>
											</el-form-item>
										</td>
									</tr>
									<tr class="iconHidden">
										<td class="width-15"><span style="color: red">*&nbsp;</span>付款方式</td>
										<td class="width-30">
											<el-form-item prop="payway"
												:rules="[{required: true, message:'付款方式不能为空', trigger:['blur','change']}]">
												<el-select v-model="inputForm.payway" placeholder="请选择"
													style="width: 100%;" :disabled="formReadOnly">
													<el-option v-for="item in $dictUtils.getDictList('payway')"
														:key="item.value" :label="item.label" :value="item.value">
													</el-option>
												</el-select>
											</el-form-item>
										</td>
										<td class="width-15" v-if="this.inputForm.payway==1"><span
												style="color: red">*&nbsp;</span>收款方</td>
										<td class="width-30" v-if="this.inputForm.payway==1">
											<el-form-item prop="receivingSide"
												:rules="[{required: true, message:'收款方不能为空', trigger:['blur','change'],pattern:/^[\u4e00-\u9fa5a-zA-Z]*$/}]">
												<el-input v-model="inputForm.receivingSide" :disabled="formReadOnly">
												</el-input>
											</el-form-item>
										</td>
										<td class="width-15" v-if="this.inputForm.payway==0"></td>
										<td class="width-30" v-if="this.inputForm.payway==0"></td>
									</tr>
									<tr class="iconHidden" v-if="this.inputForm.payway==1">
										<td class="width-15"><span style="color: red">*&nbsp;</span>开户行</td>
										<!-- <td class="width-30">
                                <el-form-item  prop="bankname" :rules="[{required: true, message:'开户行不能为空', trigger:['blur','change']}]">
                                  <el-input v-model="inputForm.bankname"  :disabled="formReadOnly"></el-input>
                              </el-form-item>
                            </td> -->
										<td class="width-30">
											<el-form-item prop="bankname"
												:rules="[ {required: true, message:'开户行不能为空', trigger:['blur','change']} ]">
												<el-select v-model="inputForm.bankname" placeholder="请选择"
													style="width: 100%;">
													<el-option
														v-for="(item,index) in $dictUtils.getDictList('zhaohang_chinese_bank')"
														:key="index" :label="item.label" :value="item.value">
													</el-option>
												</el-select>
											</el-form-item>
										</td>
										<td class="width-15"><span style="color: red">*&nbsp;</span>账号</td>
										<td class="width-30">
											<el-form-item prop="bankno"
												:rules="[{required: true, message:'账号不能为空', trigger:['blur','change'],pattern:/^[0-9]*$/}]">
												<el-input v-model="inputForm.bankno" :disabled="formReadOnly">
												</el-input>
											</el-form-item>
										</td>
									</tr>
									<tr style="height: 80px;line-height: 80px">
										<td class="width-15 active" style="line-height: 80px">说明
										</td>
										<td colspan="4" style="padding:0 10px">
											<el-form-item prop="content">
												<el-input type="text" v-model="inputForm.content"
													:disabled="formReadOnly" placeholder="非国有五大银行时,请在此处填写银行分行详细全称">
												</el-input>
											</el-form-item>
										</td>
									</tr>
									<tr style="line-height: 3.5;">
										<td colspan="4"
											style="font-weight: bold;text-align: left;padding-left: 32px;position: relative;font-size: 14px">
											<img src="../../../../../assets/imgs/processManagement/work.png" alt=""
												style="position: absolute;width: 20px;height: 20px;left: 0px;top: 14px;margin-left: 8px">
											报销凭证
											<el-select v-model="departmentId" placeholder="请选择" :disabled="moneyDisabled || historyMoney">
												<el-option
													v-for="(item,index) in departmentList"
													:key="index" :label="item.name" :value="item.id">
												</el-option>
											</el-select>
											<span style="margin-left:70px;" v-if="haveAuthority">
												<span style="color:red">账户余额:</span>
												<span v-if="accountBalancesShow" style="padding:0 5px">****</span>
												<span v-if="!accountBalancesShow"
													style="padding:0 5px;font-weight:400;">{{this.accountBalances}}</span>
												<i class="el-icon-view" @click="showOrHidden" style="color:#1296DB"></i>
											</span>
										</td>
									</tr>
									<tr v-if="!formReadOnly || (this.$route.query.code &&this.$route.query.attends)">
										<td colspan="4" class="addDelImg">
											<i v-if="this.showButton" id="add" @click="add"
												class="el-icon-circle-plus"></i>
											<i v-if="this.showButton&&tables.length>0" id="sub" @click="delAll"
												class="el-icon-remove"></i>
										</td>
									</tr>
									<tr>
										<td colspan="4" class="elTable">
											<div style="width:100%">
												<!-- <el-button size="small" @click="addReimbursementContentRow" type="primary">新增</el-button> -->
												<el-table :data="tables" size="small" row-key="id" @selection-change="selectionChangeHandleInvoices"
													style="border-collapse:collapse;" :cell-style="cellStyle_attached"
													ref="mytables" :row-class-name="tableRowClassName" :key="Math.random()"
													:header-cell-class-name="cellHeadStyle_attached"
													:tree-props="{ children: 'children', hasChildren: 'hasChildren'}">
													<el-table-column type="selection" width="50" align="center">
													</el-table-column>
													<!-- <el-table-column prop="index" align="center"  label="序号" >
                                        <template  slot-scope="scope">
                                          <el-input v-model="scope.row.index"  ></el-input>
                                        </template>
                                      </el-table-column> -->
													<el-table-column prop="reimbursementdate" header-align="center"
														align="center" show-overflow-tooltip label="日期">
														<template slot="header">
															<span style="color: red">*&nbsp;</span>
															<span>日期</span>
														</template>
														<template slot-scope="scope">
															<el-date-picker :disabled="true"
																v-model="scope.row.reimbursementdate" type="date"
																style="width: 100%;" value-format="yyyy-MM-dd"
																format="yyyy-MM-dd" size="mini" placeholder="年/月/日">
															</el-date-picker>
														</template>
													</el-table-column>
													<el-table-column prop="accounttype" header-align="center"
														align="center" label="报销类别" min-width="100">
														<template slot="header">
															<span style="color: red">*&nbsp;</span>
															<span>报销类别</span>
														</template>
														<template slot-scope="scope">
															<!-- <el-cascader :disabled="formReadOnly" placeholder="请选择"
																v-model="scope.row.accounttype" :props="{
																expandTrigger: 'hover',checkStrictly: true,label: 'name',value: 'id',
																children: 'children',}" :key="cascaderKey" size="small" ref="bussinessTypes"
																@change="handleChange" clearable
																@click.native="handleSelect" :popper-class="'cascader1'"
																:options="valueData">
															</el-cascader> -->
															<el-input v-model="scope.row.accounttype" :disabled="true"></el-input>
														</template>
													</el-table-column>
													<el-table-column prop="reimbursementinstruction"
														header-align="center" align="center" show-overflow-tooltip
														label="报销说明">
														<template slot="header">
															<span style="color: red">*&nbsp;</span>
															<span>报销说明</span>
														</template>
														<template slot-scope="scope">
															<el-input v-model="scope.row.reimbursementinstruction"
																:disabled="true"></el-input>
														</template>
													</el-table-column>
													<el-table-column prop="reimbursableamount" header-align="center"
														align="center" show-overflow-tooltip label="报销金额">
														<template slot="header">
															<span style="color: red">*&nbsp;</span>
															<span>报销金额</span>
														</template>
														<template slot-scope="scope">
															<el-input v-model="scope.row.reimbursableamount"
																@input="computertotalmoney" :disabled="true"></el-input>
														</template>
													</el-table-column>
													<el-table-column prop="ticketnumber" header-align="center"
														align="center" show-overflow-tooltip label="票据张数">
														<template slot="header">
															<span style="color: red">*&nbsp;</span>
															<span>票据张数</span>
														</template>
														<template slot-scope="scope">
															<el-input v-model="scope.row.ticketnumber"
																:disabled="true"></el-input>
														</template>
													</el-table-column>
													<el-table-column prop="approvedmoney" header-align="center"
														align="center" show-overflow-tooltip label="核定金额">
														<template slot="header">
															<span style="color: red"
																v-if="this.$route.query.attend">*&nbsp;</span>
															<span>核定金额</span>
														</template>
														<template slot-scope="scope">
															<!-- @input="computerapprovedmoney" -->
															<el-input v-model="scope.row.approvedmoney"
																:disabled="moneyDisabled || historyMoney"
																@blur="blurapprovedmoney(scope.row)"></el-input>
														</template>
													</el-table-column>
													<el-table-column prop="actreportmoney" header-align="center"
														align="center" show-overflow-tooltip label="实报金额">
														<template slot="header">
															<span style="color: red"
																v-if="this.$route.query.attend">*&nbsp;</span>
															<span>实报金额</span>
														</template>
														<template slot-scope="scope">
															<el-input v-model="scope.row.actreportmoney"
																:disabled="true"
																@input="computeractreportmoney"
																@blur="bluractreportmoney(scope.row)"></el-input>
														</template>
													</el-table-column>
													<el-table-column prop="approvedcontent" header-align="center"
														align="center" show-overflow-tooltip label="报销金额">
														<template slot="header">
															<span>核定说明</span>
														</template>
														<template slot-scope="scope">
															<el-input :disabled="moneyDisabled || historyMoney" v-model="scope.row.approvedcontent"></el-input>
														</template>
													</el-table-column>
													<el-table-column prop="costgone" header-align="center"
														align="center" show-overflow-tooltip label="报销金额">
														<template slot="header">
															<span>费用去向</span>
														</template>
														<template slot-scope="scope">
															<el-select v-model="scope.row.costgone" placeholder="请选择" :disabled="moneyDisabled || historyMoney">
																<el-option v-for="(item,index) in departmentList" :key="index" :label="item.name" :value="item.id">
																</el-option>
															</el-select>
														</template>
													</el-table-column>
													<!-- <el-table-column  prop="notravereimburesement.applyuser.id"  header-align="center"  align="center"  show-overflow-tooltip  label="非差旅报销"></el-table-column>
                                      <el-table-column  prop="remarks"  header-align="center"  align="center"  show-overflow-tooltip  label="备注信息"></el-table-column>    -->
													<el-table-column fixed="right" label="操作">
														<template slot-scope="scope">
															<el-button v-if="scope.row.id!=''"  @click="addInvoices(scope)" type="text"  :disabled="businessId!=''"
																size="mini">添加发票</el-button>
															<!-- <el-button @click="viewReimbursementContentRow(scope.row)"
																type="text" size="mini">查看</el-button>
															<el-button @click="editReimbursementContentRow(scope.row)"
																type="text" size="minis">编辑</el-button>
															<el-button @click="delReimbursementContentRow(scope.row)"
																type="text" size="mini">删除</el-button> -->
														</template>
													</el-table-column>
												</el-table>
											</div>
										</td>
									</tr>
								</table>
							</el-form>
						</div>
					</div>
				</div>
			</div>
		</div>
		<el-dialog title="账户余额查询" :visible.sync="accountBalancesDialog" width="20%" :before-close="closePwd">
			<el-form :model="accountBalancesForm" size="small" label-width="80px" ref="accountBalancesForms"
				v-loading="accountBalancesLoading">
				<el-row :gutter="15">
					<el-col :span="18">
						<el-form-item label="密码" prop="pwd"
							:rules="[ {required: true, message:'请输入账户密码', trigger:'blur'} ]">
							<el-input v-model="accountBalancesForm.pwd" placeholder="请输出该账号密码" type="password">
							</el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button size="small" type="primary" @click="closePwd" plain>关闭</el-button>
				<el-button size="small" type="primary" @click="confirmPwd" plain>确定</el-button>
			</span>
		</el-dialog>
		<el-dialog title="出差地" :visible.sync="evectionAddressDialog" width="40%" :before-close="resetForm">
			<!-- <el-form :model="evectionAddressForm" size="small" label-width="80px" ref="evectionAddressForms"
				v-loading="evectionAddressLoading">
				<el-form-item prop="region"
					:rules="[{required: true, message:'地区不能为空', trigger:['blur','change']}]">
						  <CityPicker style="width:100%" :value="inputForm.region" :clearable="true"  :accordion="true" @getValue="(value) => {inputForm.region=value}"/>
				</el-form-item>
			</el-form> -->
			<el-form :model="dynamicValidateForm" ref="dynamicValidateForm" label-width="100px" class="demo-dynamic">
				<el-form-item label="起始地" prop="beginArea" :rules="[{required: true, message:'起始地不能为空', trigger:['blur','change']}]">
					<CityPicker style="width:100%" :value="dynamicValidateForm.beginArea" :clearable="true" :accordion="true"
						@getValue="(value) => {dynamicValidateForm.beginArea=value}" />
				</el-form-item>
				<el-form-item v-for="(domain, index) in dynamicValidateForm.domains" label="途径地"
					:key="domain.key" :prop="'domains.' + index + '.value'">
					<div style="display: flex;">
						<CityPicker style="width:100%" :value="dynamicValidateForm.domains[index].betweenArea" :clearable="true" :accordion="true"
							@getValue="(value) => {dynamicValidateForm.domains[index].betweenArea=value}" />
						<el-button @click.prevent="removeDomain(domain)" size="small" style="margin-left: 10px;">删除</el-button>
					</div>
				</el-form-item>
				<el-form-item label="目的地" prop="endArea"
					:rules="[{required: true, message:'目的地不能为空', trigger:['blur','change']}]">
					<CityPicker style="width:100%" :value="dynamicValidateForm.endArea" :clearable="true" :accordion="true"
						@getValue="(value) => {dynamicValidateForm.endArea=value}" />
						
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="addDomain" type="primary" size="small">添加途径地</el-button>
				<el-button size="small" type="primary" @click="resetForm" plain>关闭</el-button>
				<el-button size="small" type="primary" @click="submitForm" plain>确定</el-button>
			</span>
		</el-dialog>
		<el-dialog title="添加发票" :visible.sync="addInvoiceDialog" width="70%">
			<el-form size="small" :inline="true" class="query-form" ref="searchForm" :model="searchForm"
				@keyup.enter.native="refreshList()" @submit.native.prevent>
				<!-- 搜索框-->
				<el-form-item prop="invoiceDate">
					<el-date-picker v-model="searchForm.invoiceDate" type="date" style="width: 100%;"
						value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="开票时间">
					</el-date-picker>
				</el-form-item>
				<el-form-item prop="invoicetype">
					<el-select v-model="searchForm.invoicetype" placeholder="发票类型" style="width: 100%;">
						<el-option v-for="(item,index) in $dictUtils.getDictList('invoicebill_type')" :key="index"
							:label="item.label" :value="item.value">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item prop="subType">
					<el-select v-model="searchForm.subType" placeholder="细分发票类型" style="width: 100%;">
						<el-option v-for="(item,index) in $dictUtils.getDictList('sub_bill_type')" :key="index"
							:label="item.label" :value="item.value">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="refreshList()" size="small">查询</el-button>
					<el-button @click="resetSearch()" size="small">重置</el-button>
				</el-form-item>
			</el-form>
			<el-table :data="dataList" size="small" height="calc(100% - 80px)" @selection-change="selectionChangeHandle"
				:cell-style="cellStyle" style="border:1px solid #d6cfe2;min-height: 400px;"
				:header-cell-class-name="cellHeadStyle" :row-class-name="tableRowClassName" v-loading="invoiceloading"
				class="table">
				<!-- <el-table-column type="selection" header-align="center" align="center" width="50">
				</el-table-column> -->
				<el-table-column  width="50" header-align="center" align="center">
				     <template slot-scope="scope">
						<el-radio v-model="radio" @change.native="getCurrentRow(scope.row)"></el-radio>
				    </template>
				</el-table-column>
				<el-table-column prop="invoiceDate" show-overflow-tooltip label="开票日期">
				</el-table-column>
				<el-table-column prop="type" show-overflow-tooltip label="发票类型">
					<template slot-scope="scope">
						{{ $dictUtils.getDictLabel("invoicebill_type", scope.row.type, '-') }}
					</template>
				</el-table-column>
				<!-- <el-table-column prop="invoiceCode" show-overflow-tooltip label="发票代码">
				</el-table-column> -->
				<el-table-column prop="subType" show-overflow-tooltip label="细分发票类型">
				</el-table-column>
				<!-- <el-table-column prop="invoiceNo" show-overflow-tooltip label="发票号码">
				</el-table-column> -->
				<el-table-column prop="invoiceContent" show-overflow-tooltip label="报销说明">
				</el-table-column>
				<el-table-column prop="withTaxAmount" show-overflow-tooltip label="含税价格">
				</el-table-column>
				<el-table-column header-align="center" align="center" fixed="right" :key="Math.random()" width="120"
					label="点击查看">
					<template slot-scope="scope">
						<el-image style="width: 100px; height: 50px" :src="scope.row.dmzUrl"
							:preview-src-list="[scope.row.dmzUrl]"></el-image>
						<!-- <el-button type="text" icon="el-icon-view" size="mini" @click="view(scope.row.id)">查看</el-button> -->
						<!-- <el-button v-if="hasPermission('zhaohang:invoice:web:userticket:sysUserTicket:edit')"
							type="text" icon="el-icon-edit" size="small" @click="edit(scope.row.id)">修改</el-button>
						<el-button v-if="hasPermission('zhaohang:invoice:web:userticket:sysUserTicket:del')" type="text"
							icon="el-icon-delete" size="small" @click="del(scope.row.id)">删除</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageNo"
				:page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="total" background
				layout="total, sizes, prev, pager, next, jumper">
			</el-pagination>
			<span slot="footer" class="dialog-footer">
				<el-button size="small" type="primary" @click="addInvoiceClose()" plain>关闭</el-button>
				<el-button size="small" type="primary" @click="addInvoice()" plain>确定</el-button>
			</span>
		</el-dialog>
		<ReimbursementContentForm ref="reimbursementContentForm" @addRow="saveReimbursementContentRow(arguments)">
		</ReimbursementContentForm>
	</div>
</template>
<script>
	import tableStyles from '../../../../../utils/mixins.js'
	import ReimbursementContentForm from './ReimbursementContentForm'
	import UserSelect from '@/components/userSelect'
	import SelectTree from '@/components/treeSelect/treeSelect.vue'
	import GridSelects2 from '@/components/gridSelect/index2.vue'
	import CityPicker from '@/components/cityPicker'
	export default {
		mixins: [tableStyles],
		name: 'myGridSelects2',
		provide() {
			return {
				writeoffmoneyChange: this.writeoffmoneyChange,
				writeoffmoneybigChange: this.writeoffmoneybigChange,
			}
		},
		data() {
			var bankAccountValid = (rule, value, callback) => {
				const strBin =
					"10,18,30,35,37,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,58,60,62,65,68,69,84,87,88,94,95,98,99";
				if (!value) {
					return callback(new Error("收款账户不能为空"));
				} else if (!Number.isInteger(+value)) {
					callback(new Error("银行卡号必须全为数字"));
				} else if (value.trim().length < 12 || value.trim().length > 19) {
					callback(new Error("银行卡号长度必须在12到19之间"));
				} else if (strBin.indexOf(value.substring(0, 2)) === -1) {
					callback(new Error("银行卡号开头6位不符合规范"));
				} else {
					callback();
				}
			};
			return {
				// 添加发票
				addInvoiceDialog: false,
				dataList: [],
				invoiceloading: false,
				pageNo: 1,
				pageSize: 10,
				total: 0,
				invoiceIndex: 0,
				invocieChecks:"",
				radio:"",

				title: '',
				method: '',
				loading: false,
				inputForm: {
					id: '',
					reimbursementContentList: [],
					applyuser: {
						id: ''
					},
					company: {
						id: ''
					},
					applydate: '',
					depart: {
						id: ''
					},
					startdate: '',
					enddate: '',
					starttime: '',
					endtime: '',
					traveldays: '',
					totalmoney: 0,
					totalmoneybig: '',
					borrowmoney: 0,
					borrowmoneybig: '',
					realmoney: 0,
					realmoneybig: '',
					approvedmoneytotal: 0, //核定金额
					approvedmoneytotalbig: '', //核定金额大写
					writeoffmoney: '',
					writeoffmoneybig: '',
					writeoffChangeNum: '', //冲销金额选择的时候保存id的
					payway: '',
					receivingSide: '', //收款方
					bankname: '', //开户行
					bankno: '', //账号
					content: '',
					beginArea: '', //起始地
					endArea: '', //目的地
					betweenArea: '', //途径地
					travelarea:""
				},
				searchForm: {
					invoiceDate: "",
					invoicetype: "",
					subType: ""
				},
				tables: [{
					reimbursementdate: '', //报销日期
					accountMenu: '', //报销类目
					accounttype: '', //报销类型            
					reimbursementinstruction: '', //报销说明
					reimbursableamount: 0, //报销金额
					ticketnumber: '', //票据张数
					actreportmoney: '', //实报金额
					approvedmoney: '', //核定金额
					userTicketId: "",
					approvedcontent:"",//核定说明
					costgone:"",//费用去向
					// notravereimburesement:{
					// applyuser:{
					//     id:''
					//   }
					// },//非差旅报销
					// remarks:'',//备注
				}], //附表
				showButton: true, //按钮显示与否
				valueData: [], //报销二，三级类目
				cascaderKey: 1,
				moneyDisabled: true, //实报金额，核定金额编辑权限，接口查询（财务有）
				historyMoney: false, //dis用于实报和核定金额 历史还是办理时禁用
				writeoffmoneyDisabled: false, //冲销金额编辑权限根据查询借款金额
				writeoffmoneyListUrl: '', //报销借款url
				editSwitch: true, //用于编辑时候切换input->组件选择/输入
				writeoffHidden: false, //根据审批状态，办理，历史，编辑隐藏或者展示冲销弹出框或者输入框
				personWriteoff: false, //个人中心借款跳到差旅，非差旅，禁用冲销选择框

				accountBalances: '',
				accountBalancesShow: true, //账户余额
				accountBalancesDialog: false,
				accountBalancesForm: {
					pwd: '',
				},
				accountBalancesLoading: '',
				haveAuthority: false, //账户余额显示与否,
				keepWriteoffmoney: '', //审核时用来保存初始冲销金额 的
				keepWriteoffmoneyId: '', //审核时用来保存初始冲销金额id的
				//校验正确
				rule: {
					bankno: {
						required: true,
						trigger: "blur",
						validator: bankAccountValid,
					},
				},
				//起始地
				evectionAddressDialog:false,
				dynamicValidateForm: {
					beginArea: '', //起始地
					endArea: '', //目的地
					domains: [{
						betweenArea: '', //途径地
					}],
				},
				//设置部门
				departmentId:"",
				departmentList:[],
				departmentchecks:[]
			}
		},
		props: {
			businessId: {
				type: String,
				default: ''
			},
			formReadOnly: {
				type: Boolean,
				default: false
			}
		},
		components: {
			UserSelect,
			SelectTree,
			ReimbursementContentForm,
			GridSelects2,
			CityPicker
		},
		watch: {
			'businessId': {
				handler(newVal) {
					if (this.$store.state.user.id != '') {
						var users = this.$store.state.user
					} else {
						var users = JSON.parse(sessionStorage.getItem("userInfo"));
					}
					this.writeoffmoneyListUrl = '/rf/receive/findBorrowProcess?userid=' + users.id;
					this.getBorrowmoney(users); //查询借款金额          
					this.getBusssinessType(users.company.id);
					if (this.businessId) {
						this.init(this.businessId);
						this.getfinancePower(users); //查询是否为财务
						this.getHaveAuthority(); //获取是否具有查看账户余额权限
					} else {
						this.$nextTick(() => {
							this.$refs.inputForm.resetFields();
							this.inputForm.applyuser.id = users.id;
							this.inputForm.company.id = users.company.id;
							this.inputForm.depart.id = users.office.id;
							this.inputForm.applydate = this.getNowTime();
							this.inputForm.realmoney = 0; //发起流程默认实报金额为0
							this.realmoneySwitch();
							this.inputForm.totalmoney = 0; //发起流程默认报销金额为0
							this.totalmoneySwitch();
							this.inputForm.approvedmoneytotal = 0; //发起流程默认核定金额为0
							this.approvedmoneySwitch();
							this.moneyDisabled = true; //附表实报金额，核定金额禁用
						})
					}
				},
				immediate: true,
				deep: false
			},
			// '$route'(to,from){     
			//   console.log(to,'to')   
			//   if(to.query.id){
			//     this.getBusssinessType(); 
			//   }   
			// },
		},

		created() {
			window.addEventListener("beforeunload", () => {
				sessionStorage.setItem("userInfo", JSON.stringify(this.$store.state.user))
			})
			this.getPayMoney();
			this.getdepartmentS();
		},
		activated(){
			
		},
		methods: {
			selectionChangeHandleInvoices(val){
				console.log(val);
				this.departmentchecks=val;
			},
			getdepartmentS(){
				this.$http({
					url: '/sys/web/userinfo/findDepartemnt',
					method: 'get',
					params: {
						'id':this.$store.state.user.companyId,
					}
				}).then(({
					data
				}) => {
					if (data && data.success) {
						console.log(data)
						this.departmentList=data.list;
					}
				})
			},
			submitForm() {
				let arr=[];
				for(var i=0;i<this.dynamicValidateForm.domains.length;i++){
					arr.push(this.dynamicValidateForm.domains[i].betweenArea);
				}
				this.inputForm.beginArea=this.dynamicValidateForm.beginArea;
				this.inputForm.betweenArea=arr.join(",");
				this.inputForm.endArea=this.dynamicValidateForm.beginArea;
				console.log("1",this.inputForm.betweenArea);
				this.evectionAddressDialog=false;
			},
			resetForm() {
				this.$refs['dynamicValidateForm'].resetFields();
				this.dynamicValidateForm.domains=[{betweenArea: ''}];
				this.evectionAddressDialog=false;
			},
			removeDomain(item) {
				var index = this.dynamicValidateForm.domains.indexOf(item)
				if (index !== -1) {
					this.dynamicValidateForm.domains.splice(index, 1)
				}
			},
			addDomain() {
				this.dynamicValidateForm.domains.push({
					betweenArea: ''
				});
			},
			addInvoices(scope) {
				this.invoiceIndex = scope.$index;
				this.addInvoiceDialog = true;
				this.refreshList();
			},
			addInvoiceClose() {
				this.addInvoiceDialog = false;
			},
			addInvoice(){
				this.addInvoiceDialog = false;
				console.log(this.invocieChecks);
				console.log(this.tables);
				if(this.invocieChecks){
					this.tables[this.invoiceIndex].reimbursementinstruction=this.invocieChecks.invoiceContent;
					this.tables[this.invoiceIndex].accounttype=this.invocieChecks.accountType;
					this.tables[this.invoiceIndex].ticketnumber=1;
					this.tables[this.invoiceIndex].reimbursableamount=this.invocieChecks.withTaxAmount;
					this.tables[this.invoiceIndex].userTicketId=this.invocieChecks.id;
					this.tables[this.invoiceIndex].reimbursementdate=this.invocieChecks.invoiceDate;
					for (let i = 0; i < this.tables.length; i++) {
						this.inputForm.totalmoney += parseFloat(this.tables[i].reimbursableamount)
					}
				}
				console.log(this.inputForm.totalmoney);
			},
			getCurrentRow(row){
				console.log(row);
				this.invocieChecks=row;
			},
			refreshList() {
				this.invoiceloading = true
				this.$http({
					url: '/zhaohang/invoice/web/userticket/sysUserTicket/getUserTicket',
					method: 'get',
					params: {
						'pageNo': this.pageNo,
						'pageSize': this.pageSize,
						'userid':this.$store.state.user.id,
						'invoiceType':'0',
						...this.searchForm
					}
				}).then(({
					data
				}) => {
					if (data && data.success) {
						this.dataList = data.page.list
						this.total = data.page.count
						this.invoiceloading = false
					}
				})
			},
			// 每页数
			sizeChangeHandle(val) {
				this.pageSize = val
				this.pageNo = 1
				this.refreshList()
			},
			// 当前页
			currentChangeHandle(val) {
				this.pageNo = val
				this.refreshList()
			},
			// 多选
			selectionChangeHandle(val) {
				console.log(val);
			},
			
			//获取是否具有查看账户余额权限
			getHaveAuthority() {
				if (this.$store.state.user.id != '') {
					var users = this.$store.state.user
				} else {
					var users = JSON.parse(sessionStorage.getItem("userInfo"));
				}
				this.$http({
					url: '/accountBalance/getUserAuthority',
					method: 'get',
					params: {
						uid: users.id,
					}
				}).then(({
					data
				}) => {
					if (data && data.success && data.authority == 1) {
						this.haveAuthority = true;
					}
				})

			},
			//余额与****切换
			showOrHidden() {
				this.accountBalancesShow = !this.accountBalancesShow;
				if (!this.accountBalancesShow) {
					this.accountBalances = '';
					this.accountBalancesDialog = true;
				}
			},
			//查询余额关闭
			closePwd() {
				this.accountBalancesShow = true;
				this.accountBalancesDialog = false;
				this.$refs['accountBalancesForms'].resetFields();
			},
			//查询余额确认
			confirmPwd() {
				if (this.$store.state.user.id != '') {
					var users = this.$store.state.user
				} else {
					var users = JSON.parse(sessionStorage.getItem("userInfo"));
				}
				this.$refs['accountBalancesForms'].validate((valid) => {
					if (valid) {
						this.accountBalancesLoading = true;
						this.$http({
							url: '/accountBalance/getBalance',
							method: 'get',
							params: {
								uid: users.id,
								company: users.company.id,
								pwd: this.accountBalancesForm.pwd
							}
						}).then(({
							data
						}) => {
							this.accountBalancesLoading = false;
							this.accountBalancesDialog = false;
							this.$refs.accountBalancesForms.resetFields();
							if (data && data.success) {
								this.$message.success(data.msg);
								this.accountBalances = data.balance;
							} else {
								this.accountBalancesShow = true;
							}
						})
					}
				})
			},

			//根据审批状态，办理，历史，编辑隐藏或者展示冲销弹出框或者输入框
			getPayMoney() {
				if (this.$route.query.dis) {
					this.historyMoney = true; //根据审批状态，输入框显示，选择框隐藏 回显专用
				}
				if (this.$route.query.code) {
					this.writeoffHidden = true; //根据审批状态，输入框显示，选择框隐藏 回显专用
				}
				if (this.$route.query.attend) {
					this.writeoffHidden = true //根据是办理，还是历史，还是编辑，输入框显示，选择框隐藏  回显专用
				}
				if (this.$route.query.payId) {
					this.writeoffHidden = true; //个人中心借款冲销  输入框显示
					this.personWriteoff = true; //输入框禁用
					this.inputForm.writeoffmoney = this.$route.query.payMoney; //默认冲销借款
					this.inputForm.writeoffChangeNum = this.$route.query.payId; //默认冲销借款 id
					this.writeoffmoneySwitch(); //冲销转大写
				}
			},
			//查询该用户是否为财务，是否具有编辑实报和核定金额权限
			getfinancePower(users) {
				this.$http({
					url: `/rf/receive/getApprovalPower`,
					method: 'get',
					params: {
						userid: users.id,
					}
				}).then(({
					data
				}) => {
					if (data && data.isUpdate == 1) {
						this.moneyDisabled = true;
					} else if (data && data.isUpdate == 0) {
						this.moneyDisabled = false;
					}
				})
			},
			//查询发起流程默认借款金额
			getBorrowmoney(users) {
				this.$http({
					url: `/rf/receive/findBorrowmoney`,
					method: 'get',
					params: {
						userid: users.id,
					}
				}).then(({
					data
				}) => {
					if (data && data.success) {
						this.inputForm.borrowmoney = data.money;
						this.borrowmoneySwitch();
						if (Number(this.inputForm.borrowmoney) == 0) {
							this.writeoffmoneyDisabled = true; //选择框禁用，该选项可无
							this.personWriteoff = true //输入框禁用
							this.writeoffHidden = true; //输入框显示
							this.inputForm.writeoffmoney = 0; //冲销禁用默认为0
							this.writeoffmoneySwitch(); //转大写
						}
					}
				})
			},
			//用于编辑时更改获取焦点使其选择框 出
			clearwriteoffmoney() {
				this.editSwitch = false;
				this.inputForm.writeoffmoney = '0'; //点击时使其冲销为0
				this.writeoffmoneySwitch(); //冲销转大写
			},
			//发起流程时冲销的值
			getValues(v) {
				this.inputForm.writeoffmoney = v[1]; //选择时候的数值
				this.inputForm.writeoffChangeNum = v[0]; //选择时候的id
			},
			//从子页面获取当前手动输入的冲销金额的值
			writeoffmoneyChange(value) {
				if (value) {
					this.inputForm.writeoffmoney = value;
					this.inputForm.writeoffChangeNum = ''; //清空之前选中的id值
				}
			},
			//从子页面获取当前手动输入的冲销金额的值 转大写
			writeoffmoneybigChange(value) {
				this.inputForm.writeoffmoneybig = value;
			},
			//根据下面计算上面报销总额
			computertotalmoney() {
				let sum = 0;
				for (let i = 0; i < this.tables.length; i++) {
					if (this.tables[i].reimbursableamount) {
						sum += Number(this.tables[i].reimbursableamount);
					}
				}
				this.inputForm.totalmoney = sum;
				this.totalmoneySwitch();
			},
			//有权限时 根据下面计算上面实报总额
			computeractreportmoney(row) {
				let sum = 0;
				for (let i = 0; i < this.tables.length; i++) {
					if (this.tables[i].actreportmoney) {
						sum += Number(this.tables[i].actreportmoney);
					}

				}
				this.inputForm.realmoney = sum;
				this.realmoneySwitch();
			},
			//实报金额失去焦点 比较大小
			bluractreportmoney(row) {
				if ((row.approvedmoney && row.actreportmoney && (Number(row.actreportmoney) > Number(row
						.approvedmoney))) ||
					(row.reimbursableamount && row.actreportmoney && (Number(row.actreportmoney) > Number(row
						.reimbursableamount)))
				) {
					this.$message.warning('实报金额不能大于核定金额和报销金额');
					row.approvedmoney = '';
					row.actreportmoney = '';
					return false
				}
				this.$message.warning('请确认数据是否核对无误');
			},
			//根据下面计算上面核定总额  判断是否更改冲销金额
			computerapprovedmoney() {
				let sum = 0;
				for (let i = 0; i < this.tables.length; i++) {
					if (this.tables[i].approvedmoney) {
						sum += Number(this.tables[i].approvedmoney);
					}
				}
				this.inputForm.approvedmoneytotal = sum;
				this.approvedmoneySwitch();
				this.inputForm.writeoffmoney = '';
				this.inputForm.writeoffChangeNum = '';
				if (this.inputForm.approvedmoneytotal <= this.keepWriteoffmoney) {
					this.inputForm.writeoffmoney = this.inputForm.approvedmoneytotal;
				} else {
					this.inputForm.writeoffmoney = this.keepWriteoffmoney;
					this.inputForm.writeoffChangeNum = this.keepWriteoffmoneyId;
				}
				this.writeoffmoneySwitch();
			},
			//核定金额失去焦点 比较大小
			blurapprovedmoney(row) {
				if (row.approvedmoney && row.reimbursableamount && (Number(row.approvedmoney) > Number(row
						.reimbursableamount))) {
					this.$message.warning('核定金额不能大于报销金额');
					row.approvedmoney = 0;
					this.inputForm.realmoney=0;
					row.actreportmoney=0;
					this.inputForm.approvedmoneytotal=0;
					return false
				}else{
					this.inputForm.realmoney=0;
					this.inputForm.approvedmoneytotal=row.approvedmoney;
					row.actreportmoney=row.approvedmoney-this.inputForm.writeoffmoney;
					for(var i=0;i<this.tables.length;i++){
						this.inputForm.realmoney+=Number(row.actreportmoney);
					}
				}
			},
			//本次冲销金额大写(只用于编辑流程的时候)
			writeoffmoneySwitch() {
				var money = this.inputForm.writeoffmoney;
				var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖');
				//基本单位
				var cnIntRadice = new Array('', '拾', '佰', '仟');
				//对应整数部分扩展单位
				var cnIntUnits = new Array('', '万', '亿', '兆');
				//对应小数部分单位
				var cnDecUnits = new Array('角', '分', '毫', '厘');
				//整数金额时后面跟的字符
				var cnInteger = '整';
				//整型完以后的单位
				var cnIntLast = '元';
				//最大处理的数字
				var maxNum = 999999999999999.9999;
				//金额整数部分
				var integerNum;
				//金额小数部分
				var decimalNum;
				//输出的中文金额字符串
				var chineseStr = '';
				//分离金额后用的数组，预定义
				var parts;
				if (money == '') {
					this.inputForm.writeoffmoneybig = chineseStr
				}
				money = parseFloat(money);
				if (money >= maxNum) {
					//超出最大处理数字
					return '';
				}
				if (money == 0) {
					chineseStr = cnNums[0] + cnIntLast + cnInteger;
				}
				//转换为字符串
				money = money.toString();
				if (money.indexOf('.') == -1) {
					integerNum = money;
					decimalNum = '';
				} else {
					parts = money.split('.');
					integerNum = parts[0];
					decimalNum = parts[1].substr(0, 4);
				}
				//获取整型部分转换
				if (parseInt(integerNum, 10) > 0) {
					var zeroCount = 0;
					var IntLen = integerNum.length;
					for (var i = 0; i < IntLen; i++) {
						var n = integerNum.substr(i, 1);
						var p = IntLen - i - 1;
						var q = p / 4;
						var m = p % 4;
						if (n == '0') {
							zeroCount++;
						} else {
							if (zeroCount > 0) {
								chineseStr += cnNums[0];
							}
							//归零
							zeroCount = 0;
							chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
						}
						if (m == 0 && zeroCount < 4) {
							chineseStr += cnIntUnits[q];
						}
					}
					chineseStr += cnIntLast;
				}
				//小数部分
				if (decimalNum != '') {
					var decLen = decimalNum.length;
					for (var i = 0; i < decLen; i++) {
						var n = decimalNum.substr(i, 1);
						if (n != '0') {
							chineseStr += cnNums[Number(n)] + cnDecUnits[i];
						}
					}
				}
				if (chineseStr == '') {
					chineseStr += cnNums[0] + cnIntLast + cnInteger;
				} else if (decimalNum == '' && money != 0) {
					chineseStr += cnInteger;
				}
				this.inputForm.writeoffmoneybig = chineseStr
			},
			// //实报金额大写
			realmoneySwitch() {
				var money = this.inputForm.realmoney;
				var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖');
				//基本单位
				var cnIntRadice = new Array('', '拾', '佰', '仟');
				//对应整数部分扩展单位
				var cnIntUnits = new Array('', '万', '亿', '兆');
				//对应小数部分单位
				var cnDecUnits = new Array('角', '分', '毫', '厘');
				//整数金额时后面跟的字符
				var cnInteger = '整';
				//整型完以后的单位
				var cnIntLast = '元';
				//最大处理的数字
				var maxNum = 999999999999999.9999;
				//金额整数部分
				var integerNum;
				//金额小数部分
				var decimalNum;
				//输出的中文金额字符串
				var chineseStr = '';
				//分离金额后用的数组，预定义
				var parts;
				if (money == '') {
					this.inputForm.realmoneybig = chineseStr
				}
				money = parseFloat(money);
				if (money >= maxNum) {
					//超出最大处理数字
					return '';
				}
				if (money == 0) {
					chineseStr = cnNums[0] + cnIntLast + cnInteger;
				}
				//转换为字符串
				money = money.toString();
				if (money.indexOf('.') == -1) {
					integerNum = money;
					decimalNum = '';
				} else {
					parts = money.split('.');
					integerNum = parts[0];
					decimalNum = parts[1].substr(0, 4);
				}
				//获取整型部分转换
				if (parseInt(integerNum, 10) > 0) {
					var zeroCount = 0;
					var IntLen = integerNum.length;
					for (var i = 0; i < IntLen; i++) {
						var n = integerNum.substr(i, 1);
						var p = IntLen - i - 1;
						var q = p / 4;
						var m = p % 4;
						if (n == '0') {
							zeroCount++;
						} else {
							if (zeroCount > 0) {
								chineseStr += cnNums[0];
							}
							//归零
							zeroCount = 0;
							chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
						}
						if (m == 0 && zeroCount < 4) {
							chineseStr += cnIntUnits[q];
						}
					}
					chineseStr += cnIntLast;
				}
				//小数部分
				if (decimalNum != '') {
					var decLen = decimalNum.length;
					for (var i = 0; i < decLen; i++) {
						var n = decimalNum.substr(i, 1);
						if (n != '0') {
							chineseStr += cnNums[Number(n)] + cnDecUnits[i];
						}
					}
				}
				if (chineseStr == '') {
					chineseStr += cnNums[0] + cnIntLast + cnInteger;
				} else if (decimalNum == '' && money != 0) {
					chineseStr += cnInteger;
				}
				this.inputForm.realmoneybig = chineseStr
			},
			//核定金额大写
			approvedmoneySwitch() {
				var money = this.inputForm.approvedmoneytotal;
				var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖');
				//基本单位
				var cnIntRadice = new Array('', '拾', '佰', '仟');
				//对应整数部分扩展单位
				var cnIntUnits = new Array('', '万', '亿', '兆');
				//对应小数部分单位
				var cnDecUnits = new Array('角', '分', '毫', '厘');
				//整数金额时后面跟的字符
				var cnInteger = '整';
				//整型完以后的单位
				var cnIntLast = '元';
				//最大处理的数字
				var maxNum = 999999999999999.9999;
				//金额整数部分
				var integerNum;
				//金额小数部分
				var decimalNum;
				//输出的中文金额字符串
				var chineseStr = '';
				//分离金额后用的数组，预定义
				var parts;
				if (money == '') {
					this.inputForm.approvedmoneytotalbig = chineseStr
				}
				money = parseFloat(money);
				if (money >= maxNum) {
					//超出最大处理数字
					return '';
				}
				if (money == 0) {
					chineseStr = cnNums[0] + cnIntLast + cnInteger;
				}
				//转换为字符串
				money = money.toString();
				if (money.indexOf('.') == -1) {
					integerNum = money;
					decimalNum = '';
				} else {
					parts = money.split('.');
					integerNum = parts[0];
					decimalNum = parts[1].substr(0, 4);
				}
				//获取整型部分转换
				if (parseInt(integerNum, 10) > 0) {
					var zeroCount = 0;
					var IntLen = integerNum.length;
					for (var i = 0; i < IntLen; i++) {
						var n = integerNum.substr(i, 1);
						var p = IntLen - i - 1;
						var q = p / 4;
						var m = p % 4;
						if (n == '0') {
							zeroCount++;
						} else {
							if (zeroCount > 0) {
								chineseStr += cnNums[0];
							}
							//归零
							zeroCount = 0;
							chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
						}
						if (m == 0 && zeroCount < 4) {
							chineseStr += cnIntUnits[q];
						}
					}
					chineseStr += cnIntLast;
				}
				//小数部分
				if (decimalNum != '') {
					var decLen = decimalNum.length;
					for (var i = 0; i < decLen; i++) {
						var n = decimalNum.substr(i, 1);
						if (n != '0') {
							chineseStr += cnNums[Number(n)] + cnDecUnits[i];
						}
					}
				}
				if (chineseStr == '') {
					chineseStr += cnNums[0] + cnIntLast + cnInteger;
				} else if (decimalNum == '' && money != 0) {
					chineseStr += cnInteger;
				}
				this.inputForm.approvedmoneytotalbig = chineseStr
			},
			// 借款金额大写
			borrowmoneySwitch() {
				var money = this.inputForm.borrowmoney;
				var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖');
				//基本单位
				var cnIntRadice = new Array('', '拾', '佰', '仟');
				//对应整数部分扩展单位
				var cnIntUnits = new Array('', '万', '亿', '兆');
				//对应小数部分单位
				var cnDecUnits = new Array('角', '分', '毫', '厘');
				//整数金额时后面跟的字符
				var cnInteger = '整';
				//整型完以后的单位
				var cnIntLast = '元';
				//最大处理的数字
				var maxNum = 999999999999999.9999;
				//金额整数部分
				var integerNum;
				//金额小数部分
				var decimalNum;
				//输出的中文金额字符串
				var chineseStr = '';
				//分离金额后用的数组，预定义
				var parts;
				if (money == '') {
					this.inputForm.borrowmoneybig = chineseStr
				}
				money = parseFloat(money);
				if (money >= maxNum) {
					//超出最大处理数字
					return '';
				}
				if (money == 0) {
					chineseStr = cnNums[0] + cnIntLast + cnInteger;
				}
				//转换为字符串
				money = money.toString();
				if (money.indexOf('.') == -1) {
					integerNum = money;
					decimalNum = '';
				} else {
					parts = money.split('.');
					integerNum = parts[0];
					decimalNum = parts[1].substr(0, 4);
				}
				//获取整型部分转换
				if (parseInt(integerNum, 10) > 0) {
					var zeroCount = 0;
					var IntLen = integerNum.length;
					for (var i = 0; i < IntLen; i++) {
						var n = integerNum.substr(i, 1);
						var p = IntLen - i - 1;
						var q = p / 4;
						var m = p % 4;
						if (n == '0') {
							zeroCount++;
						} else {
							if (zeroCount > 0) {
								chineseStr += cnNums[0];
							}
							//归零
							zeroCount = 0;
							chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
						}
						if (m == 0 && zeroCount < 4) {
							chineseStr += cnIntUnits[q];
						}
					}
					chineseStr += cnIntLast;
				}
				//小数部分
				if (decimalNum != '') {
					var decLen = decimalNum.length;
					for (var i = 0; i < decLen; i++) {
						var n = decimalNum.substr(i, 1);
						if (n != '0') {
							chineseStr += cnNums[Number(n)] + cnDecUnits[i];
						}
					}
				}
				if (chineseStr == '') {
					chineseStr += cnNums[0] + cnIntLast + cnInteger;
				} else if (decimalNum == '' && money != 0) {
					chineseStr += cnInteger;
				}
				this.inputForm.borrowmoneybig = chineseStr
			},
			//报销总额大写
			totalmoneySwitch() {
				console.log("报销总额",this.inputForm.totalmoney);
				var money = this.inputForm.totalmoney;
				var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖');
				//基本单位
				var cnIntRadice = new Array('', '拾', '佰', '仟');
				//对应整数部分扩展单位
				var cnIntUnits = new Array('', '万', '亿', '兆');
				//对应小数部分单位
				var cnDecUnits = new Array('角', '分', '毫', '厘');
				//整数金额时后面跟的字符
				var cnInteger = '整';
				//整型完以后的单位
				var cnIntLast = '元';
				//最大处理的数字
				var maxNum = 999999999999999.9999;
				//金额整数部分
				var integerNum;
				//金额小数部分
				var decimalNum;
				//输出的中文金额字符串
				var chineseStr = '';
				//分离金额后用的数组，预定义
				var parts;
				if (money == '') {
					this.inputForm.totalmoneybig = chineseStr
				}
				money = parseFloat(money);
				if (money >= maxNum) {
					//超出最大处理数字
					return '';
				}
				if (money == 0) {
					chineseStr = cnNums[0] + cnIntLast + cnInteger;
				}
				//转换为字符串
				money = money.toString();
				if (money.indexOf('.') == -1) {
					integerNum = money;
					decimalNum = '';
				} else {
					parts = money.split('.');
					integerNum = parts[0];
					decimalNum = parts[1].substr(0, 4);
				}
				//获取整型部分转换
				if (parseInt(integerNum, 10) > 0) {
					var zeroCount = 0;
					var IntLen = integerNum.length;
					for (var i = 0; i < IntLen; i++) {
						var n = integerNum.substr(i, 1);
						var p = IntLen - i - 1;
						var q = p / 4;
						var m = p % 4;
						if (n == '0') {
							zeroCount++;
						} else {
							if (zeroCount > 0) {
								chineseStr += cnNums[0];
							}
							//归零
							zeroCount = 0;
							chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
						}
						if (m == 0 && zeroCount < 4) {
							chineseStr += cnIntUnits[q];
						}
					}
					chineseStr += cnIntLast;
				}
				//小数部分
				if (decimalNum != '') {
					var decLen = decimalNum.length;
					for (var i = 0; i < decLen; i++) {
						var n = decimalNum.substr(i, 1);
						if (n != '0') {
							chineseStr += cnNums[Number(n)] + cnDecUnits[i];
						}
					}
				}
				if (chineseStr == '') {
					chineseStr += cnNums[0] + cnIntLast + cnInteger;
				} else if (decimalNum == '' && money != 0) {
					chineseStr += cnInteger;
				}
				this.inputForm.totalmoneybig = chineseStr
			},
			// 搜索城市切换选项
			handleChange(e) {
				this.$refs.bussinessTypes.dropDownVisible = false; //监听值发生变化就关闭它
			},
			//点击label也可以进行选择
			handleSelect(event) {
				var that = this;
				this.$nextTick(() => {
					let d = document.getElementsByClassName("cascader1");
					if (d[0] && !d[0].onclick) {
						d[0].onclick = function(e) {
							if (e.target.className == "el-cascader-node__label") {
								e.target.previousElementSibling.click();
							}
						};
					}
				});
			},
			//得到报销类目等数据
			getBusssinessType(id) {
				this.$http({
					url: `/dlyrl/oa/claimexpenses/claimingExpenses/selectProcess`,
					method: 'get',
					params: {
						company: id,
						// company:'484tf521yg854hg6asyg',
						id: 0
					}
				}).then(({
					data
				}) => {
					if (data && data.success) {
						this.valueData = data.list;
					}
				})
			},
			//计算出差时长
			travelGoOutHour() {
				if (this.inputForm.startdate.length != 0 && this.inputForm.enddate.length != 0 && this.inputForm.starttime
					.length != 0 && this.inputForm.endtime.length != 0) {
					var startDate = new Date(this.inputForm.startdate);
					var endDate = new Date(this.inputForm.enddate);
					var start = new Date(this.inputForm.startdate + ' ' + this.inputForm.starttime)
					var end = new Date(this.inputForm.enddate + ' ' + this.inputForm.endtime)
					if (startDate > endDate) {
						this.$message.warning('结束日期不能小于开始日期');
						this.inputForm.traveldays = '';
						this.inputForm.enddate = '';
						return false
					} else if (start > end) {
						this.$message.warning('同一日期结束时间不能小于开始时间');
						this.inputForm.traveldays = '';
						this.inputForm.endtime = '';
						return false
					} else {
						this.inputForm.traveldays = ((end - start) / 1000 / 86400).toFixed(2); //四舍五入去两位小数点  单位天
					}
				}
			},

			init(id) {
				if (id) {
					this.inputForm.reimbursementContentList = []
					this.loading = true
					this.inputForm.id = id
					this.$nextTick(() => {
						this.$refs.inputForm.resetFields()
						this.$http({
							url: `/dlyrl/oa/bussreimb/oaBussinessReimbursement/queryById?id=${this.inputForm.id}`,
							method: 'get'
						}).then(({
							data
						}) => {
							// console.log(data,'dd')
							this.inputForm = this.recover(this.inputForm, data.oaBussinessReimbursement);
							this.tables = data.oaBussinessReimbursement.reimbursementContentList;
							this.keepWriteoffmoney = this.inputForm.writeoffmoney;
							this.keepWriteoffmoneyId = this.inputForm.writeoffChangeNum;
							this.tables.forEach((v, i) => {
								this.tables[i].accounttype = data.oaBussinessReimbursement
									.reimbursementContentList[i].accounttype
							})
							this.getBusssinessType(this.inputForm.company.id);
							this.loading = false;
							if (this.$route.query.readOnly == 'true') {
								this.showButton = false;
							}
						})
					})
				}
			},
			saveReimbursementContentRow(child) {
				if (child[0] === '') {
					this.inputForm.reimbursementContentList.push(child[1])
				} else {
					this.inputForm.reimbursementContentList.forEach((item, index) => {
						if (item === child[0]) {
							this.inputForm.reimbursementContentList.splice(index, 1, child[1])
						}
					})
				}
			},
			addReimbursementContentRow(child) {
				this.$refs.reimbursementContentForm.init('add')
			},
			viewReimbursementContentRow(child) {
				this.$refs.reimbursementContentForm.init('view', child)
			},
			editReimbursementContentRow(child) {
				this.$refs.reimbursementContentForm.init('edit', child)
			},
			delReimbursementContentRow(child) {
				this.inputForm.reimbursementContentList.forEach((item, index) => {
					if (item === child && item.id === '') {
						this.inputForm.reimbursementContentList.splice(index, 1)
					} else if (item === child) {
						item.delFlag = '1'
						this.inputForm.reimbursementContentList.splice(index, 1, item)
					}
				})
			},
			// 表单提交
			saveForm(callback) {
				// console.log(this.inputForm.writeoffmoney,'2',this.inputForm.writeoffChangeNum)
				if (!this.writeoffmoneyDisabled) {
					if (Number(this.inputForm.writeoffmoney) > Number(this.inputForm.totalmoney) || Number(this.inputForm
							.writeoffmoney) > Number(this.inputForm.borrowmoney)) {
						this.$message.warning('本次冲销金额不能大于报销总额或者借款金额');
						return false;
					}
				}
				for (let i = 0; i < this.tables.length; i++) {
					if (!this.tables[i].reimbursementdate) {
						this.$message.warning('请选择第' + Number(i + 1) + '条信息的日期');
						return false;
					}
					if (!this.tables[i].accounttype) {
						this.$message.warning('请选择第' + Number(i + 1) + '条信息的报销类别');
						return false;
					}
					if (!this.tables[i].reimbursementinstruction) {
						this.$message.warning('请填写第' + Number(i + 1) + '条信息的报销说明');
						return false;
					}
					if (!this.tables[i].reimbursableamount) {
						this.$message.warning('请填写第' + Number(i + 1) + '条信息的报销金额');
						return false;
					}
					if (!this.tables[i].ticketnumber) {
						this.$message.warning('请填写第' + Number(i + 1) + '条信息的票据张数');
						return false;
					}
					if (!this.moneyDisabled) {
						if (!this.tables[i].approvedmoney) {
							this.$message.warning('请填写第' + Number(i + 1) + '条信息的核定金额');
							return false;
						}
						if (!this.tables[i].actreportmoney) {
							this.$message.warning('请填写第' + Number(i + 1) + '条信息的实报金额');
							return false;
						}
					}
				}
				if(this.departmentId!=''){
					for(var i=0;i<this.tables.length;i++){
						if(this.tables[i].id==this.departmentchecks[i].id){
							this.tables[i].costgone=this.departmentId;
							console.log(this.tables[i].costgone);
						}
					}
				}
				console.log(this.tables);
				this.inputForm.reimbursementContentList = this.tables;
				this.$refs['inputForm'].validate((valid) => {
					if (valid) {
						// if (this.tables[0].accounttype.length != 0) {
						// 	this.tables.forEach((v, i) => {
						// 		this.tables[i].accounttype = this.tables[i].accounttype.join(",")
						// 	})
						// }
						this.loading = true
						this.$http({
							url: `/dlyrl/oa/bussreimb/oaBussinessReimbursement/save`,
							method: 'post',
							data: this.inputForm
						}).then(({
							data
						}) => {
							this.loading = false;
							if (data && data.success) {
								callback(data.businessTable, data.businessId);
								this.$refs.inputForm.resetFields();
								this.inputForm.applyuser.id = this.$store.state.user.id;
								this.inputForm.company.id = this.$store.state.user.company.id;
								this.inputForm.depart.id = this.$store.state.user.office.id;
								this.inputForm.applydate = this.getNowTime();
								this.tables = [{
									reimbursementdate: '', //报销日期
									accountMenu: '', //报销类目
									accounttype: '', //报销类型            
									reimbursementinstruction: '', //报销说明
									reimbursableamount: '', //报销金额
									ticketnumber: '', //票据张数
									actreportmoney: '', //实报金额
									approvedmoney: '', //核定金额
									// notravereimburesement:{
									// applyuser:{
									//     id:''
									//   }
									// },//非差旅报销
									// remarks:'',//备注
								}]; //附表
							}
						})
					}
				})
			},
			//添加
			add() {
				let i = this.tables.length
				if ((i == 0) ||
					(this.tables[i - 1].reimbursementdate != '' && this.tables[i - 1].accounttype != '' && this.tables[i -
							1].reimbursementinstruction != '' && this.tables[i - 1].reimbursableamount != '' && this
						.tables[i - 1].ticketnumber != '')
				) {
					let addTable = {
						reimbursementdate: '', //报销日期
						accountMenu: '', //报销类目
						accounttype: '', //报销类型 
						reimbursementinstruction: '', //报销说明
						reimbursableamount: '', //报销金额
						ticketnumber: '', //票据张数
						actreportmoney: '', //实报金额
						approvedmoney: '', //核定金额
						// notravereimburesement:{
						//   applyuser:{
						//     id:''
						//   }
						// },//非差旅报销
						// remarks:'',//备注
					}
					this.tables.push(addTable)
				} else {
					this.$message.warning('请先填写当前已有行所有必填数据');
				}
			},
			//添加行序号
			tableRowClassName({
				row,
				rowIndex
			}) {
				row.index = rowIndex;
			},
			//删除
			delAll() {
				for (var i = this.$refs.mytables.selection.length - 1; i >= 0; i--) {
					this.tables.splice(this.$refs.mytables.selection[i].index, 1)
				}
				let sumDel = 0,
					sumDelReal = 0;
				var delArray = this.$refs.mytables.selection;
				for (let i = 0; i < delArray.length; i++) {
					sumDel += Number(delArray[i].reimbursableamount); //报销总额
					sumDelReal += Number(delArray[i].actreportmoney); //实报金额
				}
				this.inputForm.totalmoney = Number(this.inputForm.totalmoney - sumDel);
				this.totalmoneySwitch();
				this.inputForm.realmoney = Number(this.inputForm.realmoney - sumDelReal);
				this.realmoneySwitch();
				this.$refs.mytables.clearSelection();
			},
		},
	}
</script>
